<template lang="html">
  <div class="box">
    <header-title :titlemain='title'></header-title>
    <ul class="account_main">
      <li>
        <router-link to="/gerenportrait"><img src=""><p class="img_logo"><i></i></p></router-link>
      </li>
      <li>
        <a><p>用户名</p><p class="naem_right"><span>187****5468</span></p></a>
      </li>
      <li>
        <router-link to="/gerennickname"><p>昵称</p><p class="naem_right"><span>购物大赢家购物大赢家购物</span><i></i></p></router-link>
      </li>
      <li>
        <router-link to="/gerenrealname">实名认证<i></i></router-link>
      </li>
      <li>
        <router-link to="/gerenaddress">我的收货地址<i></i></router-link>
      </li>
      <li>
        <router-link to="/">修改密码<i></i></router-link>
      </li>
    </ul>
    <div class="Sign_out">退出登录</div>
  </div>
</template>
<script>
import title from "../geren/header_title.vue";
export default {
  name: 'geren',
  data () {
    return {
      title:"账号管理"
    }
  },
  components:{
    'header-title':title
  }
}
</script>

<style scoped lang="less">
@import '../../../assets/less/index.less';
.box {
  .account_main{
    width: 100vw;
    border-top: solid 2vw @color8;
    li{
      width: 100%;
      border-bottom: solid 1px @color8;
      text-align: left;
      font-size: @h1_font_size;
      a{
        width: @width;
        margin: 0 auto;
        display: block;
        line-height: 12vw;
        color: @color7;
        overflow: hidden;
        zoom:1;
        img{
          width: 12.6vw;
          height: 12.6vw;
          border-radius: 50%;
          margin-top: 3vw;
        }
        i{
          display: inline-block;
          float: right;
          margin-top: 4vw;
          margin-left: 2vw;
          .icon-gengduo-2();
        }
        p{
          display: inline-block;
        }
        .img_logo{
          float: right;
          margin-top: 3vw;
        }
        .naem_right{
          width: 70vw;
          span{
            display: inline-block;
            float: left;
            text-align: right;
            width: 64vw;
            .font_space(1);
          }
          float: right;
          text-align: right;
        }
      }
    }
  }
  .Sign_out{
    width: @width;
    height: 13.3vw;
    color: @color1;
    border-radius: 2vw;
    font-size: @h1_font_size;
    line-height: 13.3vw;
    margin: 10vw auto 0 auto;
    background-color: @color;
  }
}
</style>